.order-detail-con{
  width: 90%;
  height: 100%;
  overflow: hidden;
  margin: 0 auto;
}
.code-con{
  margin: 0 auto;
  overflow: hidden;
  position: relative;
}
.code-con .title{
  font-size: 0.85rem;
  color: #000000;
  text-align: left;
  height: 2rem;
  line-height: 2rem;
  font-weight: bold;
}
.code-con .qr-code{
  width: 100%;
  background: #ffffff;
  position: relative;
  padding-bottom: 1rem;
}
.code-con .qr-code .top{
  font-size: 0.85rem;
  color: #000000;
  text-align: center;
  height: 2.5rem;
  line-height: 2.5rem;
}
.code-con .qr-code .top span{
  font-size: 0.85rem;
  color: #ff0808;
}
.code-con .qr-code .qr-code-img{
  width: 7rem;
  height: 7rem;
  margin: 0 auto;
  border: 1px solid #e5e5e5;
}
.code-con .qr-code .qr-code-img img{

}
.order-info{
  background: #ffffff;
  margin-top: 0.5rem;
  position: relative;
  padding-left: 5%;
}
.order-info .title{
  font-size: 0.85rem;
  color: #000000;
  text-align: left;
  height: 2rem;
  line-height: 2rem;
  font-weight: bold;
}
.order-info .info-list{
 width: 100%;
  position: relative;
  overflow: hidden;
  padding-bottom: 0.75rem;
}
.order-info .info-list .list-li{
 text-align: left;
  width: 100%;
  height: 2rem;
  line-height: 2rem;
  display: flex;
}
.order-info .info-list .list-li .left{
  color: #666666;
  display: block;
  width: 25%;
}
.order-info .info-list .list-li .right{
 color: #000000;
  display: block;
  width: 75%;
}
.order-info .info-list .list-li:last-child .right{
  line-height: normal;
}
.order-info .info-list .list-li .right.color1{
  color: #ff7200;
}
.order-info .info-list .list-li .right.color2{
color: #ff0808;
}
.btn-group{
  margin-top: 0.75rem;
  display: flex;
  justify-content: center;
}
.btn-group a{
  display: block;
  width: 40%;
  margin-right: 0.5rem;
  height: 2rem;
  background: #ff0808;
  color: #ffffff;
  text-align: center;
  line-height: 2rem;
  border-radius: 5px;
  font-size: 0.85rem;
}
